<!DOCTYPE HTML>
<!-- <no_layout name="Layout\layout" />  -->
<div id="main-collect-page">
<style type="text/css">
.analysis{
	color:red;
}
.div_analysis ul li{
	margin-bottom:0.6em;
}
</style>

	<!-- main content start-->			
	<h3 class="title1">随堂练习<span class="label label-warning" style="background-color:#e94e02;padding: .1em .2em .1em;vertical-align:middle;margin-left:1%;font-size:35%">{$item.id}</span></h3>
	<!-- display test titles-->
	<form  method='POST'>
		<div class="col-md-4 stats-info widget">
			<div class="stats-title">
				<h4 class="title">试题一览</h4>
			</div>
			<div class="stats-body" style="min-height: 20px;">
				<ul class="list-unstyled subsubsub">
				<volist name="exer_info" id="vo">
					
					<li><a id="{$vo.test_num}" class="test_num test" href="{:U('Inclass/index#content-tabs?test_num='.$vo['test_num'].'')}">测试:{$vo.test_num}{$vo.statue}</a> <span class="pull-right">{$vo.rate}%</span> | 
						<div class="progress progress-striped active progress-right">
							<div class="bar green" style="width:{$vo.rate}%;"></div> 
						</div>
					</li>
				</volist>	
				</ul>
			</div>
		</div>
	</form>	
	<div class="col-md-8 general-grids grids-right widget-shadow card pressthis" id="content-tabs">
		<div class="stats-title">
			<h4 class="title" style="display:block;">测试{$exer_item.1.test_num}</h4>
		</div>
		<div class="stats-body">		
			<ul id="myTabs" class="nav nav-tabs" role="tablist"> 
				<li role="presentation" class="active">
					<a href="#home" id="home-tab" role="tab" data-toggle="tab" aria-controls="home" aria-expanded="true">练习</a>
				</li> 
				<li role="presentation" class="">
					<a href="#analysis" role="tab" id="analysis-tab" data-toggle="tab" aria-controls="analysis" aria-expanded="true">解析</a>
				</li> 
				<li role="presentation" class="dropdown">
					<a href="#" id="myTabDrop1" class="dropdown-toggle" data-toggle="dropdown" aria-controls="myTabDrop1-contents" aria-expanded="false">其他 <span class="caret"></span></a> 
					<ul class="dropdown-menu" aria-labelledby="myTabDrop1" id="myTabDrop1-contents">
						<li class="">
							<a href="#dropdown1" role="tab" id="dropdown1-tab" data-toggle="tab" aria-controls="dropdown1" aria-expanded="false">知识点</a>
						</li> 
						<li class="">
							<a href="#dropdown2" role="tab" id="dropdown2-tab" data-toggle="tab" aria-controls="dropdown2" aria-expanded="false">@mdo</a>
						</li> 
					</ul>
				</li> 
			</ul>
			<div id="myTabContent" class=" tab-content scrollbar1"> 
				<div role="tabpanel" class="tab-pane fade active in" id="home" aria-labelledby="home-tab"> 
					<form method='POST' action="{:U('Inclass/recordOption')}">	
						<ul class="list-unstyled">
							<h3 style="margin-top: 0.6em;margin-bottom: 0.6em;font-size: 1.4em;    color: #e94e02;" id="person_num">已提交：X 人</h3>
							<div id="exerciseTip" class="alert alert-info " role="alert">								
								<strong>↑↑↑</strong> 你已经完成本次练习，请查看解析！(随堂测试只记录第一次作答)
							</div>
							
							<volist name="exer_item" id="vp">
							<li>														
								<div class="inbox-row widget-shadow" id="accordion" role="tablist" aria-multiselectable="true">																	
									<!-- <a role="button" data-toggle="collapse" data-parent="#accordion" href="#submit" aria-expanded="true" aria-controls="collapseOne"> -->
										<div class="mail" ><p style="font-size:1.2em">{$i}、{$vp.question}</p></div>
									<!-- </a>												 -->
									<div class="clearfix"> </div>						
								</div>
								<div class="inbox-row widget-shadow" id="accordion" role="tablist" aria-multiselectable="true">
									<div class="mail " style="display: inline-block;"> <input type="checkbox" class="checkbox optA" id="optA" onclick="radio(this);" name="{$i}" value="optA"/> </div>												
									<!-- <a  href="javascript:radio($('[name={$i}].optA'));" > -->
										<div class="mail"  style="display: inline-block;" onclick="radio($('[name={$i}].optA'))"><p>{$vp.opta}</p></div>
									<!-- </a>												 -->
									<div class="clearfix"> </div>						
								</div>
								<div class="inbox-row widget-shadow" id="accordion" role="tablist" aria-multiselectable="true">
									<div class="mail " style="display: inline-block;"> <input type="checkbox" class="checkbox optB" id="optB" onclick="radio(this);" name="{$i}" value="optB"/> </div>												
									<!-- <a  href="javascript:radio($('[name={$i}].optB'));" > -->
										<div class="mail" style="display: inline-block;" onclick="radio($('[name={$i}].optB'))"><p>{$vp.optb}</p></div>
									<!-- </a>												 -->
									<div class="clearfix"> </div>						
								</div>
								<div class="inbox-row widget-shadow" id="accordion" role="tablist" aria-multiselectable="true">
									<div class="mail " style="display: inline-block;"> <input type="checkbox" class="checkbox optC" id="optC" onclick="radio(this);"/ name="{$i}" value="optC"> </div>												
									<!-- <a  href="javascript:radio($('[name={$i}].optC'));" > -->
										<div class="mail" style="display: inline-block;" onclick="radio($('[name={$i}].optC'))"><p>{$vp.optc}</p></div>
									<!-- </a>												 -->
									<div class="clearfix"> </div>						
								</div>
								<div class="inbox-row widget-shadow" id="accordion" role="tablist" aria-multiselectable="true">
									<div class="mail " style="display: inline-block;"> <input type="checkbox" class="checkbox optD" id="optD" onclick="radio(this);"/ name="{$i}" value="optD"> </div>												
									<!-- <a  href="javascript:radio($('[name={$i}].optD'));" > -->
										<div class="mail" style="display: inline-block;" onclick="radio($('[name={$i}].optD'))"><p>{$vp.optd}</p></div>
									<!-- </a>												 -->
									<div class="clearfix"> </div>						
								</div>																			
							</li>
							</volist>	
						</ul>
						<div class="mail-body" style="border:none;margin:0px;margin-right:10%;padding-left: 40%;text-align:right;">							
							<input type="submit" id="submit" value="Submit" >	
							
							<input name="openid" id="openid" value="{$openid}" type="hidden"  />																								
							<input name="test_num_id" id="test_num_id" value="{$exer_item.1.test_num}" type="hidden"  />																																							
						</div>	
					</form>	
				</div> 
				<div role="tabpanel" class="tab-pane fade " id="analysis" aria-labelledby="analysis-tab"> 
					<!-- <p>tutumd echo park.</p>  -->
					<div class="div_analysis">
					<ul>
					<volist name="exer_item" id="vp2" key="k">
						<li>{$k}、{$vp2.question}</li>
						<li>{$vp2.opta}</li>
						<li>{$vp2.optb}</li>
						<li>{$vp2.optc}</li>
						<li>{$vp2.optd}</li>
						<li><div class="analysis">{$vp2['right_lab']?'正确':'错误'}，你的答案：{$vp2.answer}，参考答案：{$vp2.rightans}。<br>解析：{$vp2.que_analysis}</div></li>
					</volist>
					</ul>
					</div>
				</div> 
				<div role="tabpanel" class="tab-pane fade" id="dropdown1" aria-labelledby="dropdown1-tab"> 
					<p>暂无</p> 
				</div> 
				<div role="tabpanel" class="tab-pane fade" id="dropdown2" aria-labelledby="dropdown2-tab"> 
					<p>暂无</p> 
				</div> 
			</div>							
		</div>	
	</div>
	<div class="clearfix"> </div>		
	<input name="itemid" id="itemid" value="{$item.id}" type="hidden" />	

	<!-- display right answer & explain-->
	<div class="inbox-page card pressthis"  id="div_comment" >				    			 
		<!-- <div class="inbox-row widget-shadow" id="comment1" role="tablist" aria-multiselectable="true" > -->
			<div id="collapseThree" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingThree">
				<h4 style="margin-top:3%">评论</h4>
				<div class="mail-body" style="background-color:white;" id="comment_context">
					<h6>
					{$comments?'':'还没有人评论，抢个沙发吧~'}
					<volist name="comments" id="vo">
					{$vo.class} {$vo.name}: {$vo.comment} <br />
					</volist>
					</h6>
					<form>
						<input type="text" placeholder="Reply to sender" required="" id="textcomment">
						<input type="submit" value="Send" id="setcomment">
					</form>
				</div>
			</div>
		<!-- </div> -->			
	</div>
		
	<script>
		//console.log('对象：',obj1);
		var num =new Array();
		function radio(checkbox) {
		//alert(checkbox);
			var optname = $(checkbox).attr("name");
			if(num.indexOf(optname)<0){
				num.push(optname);
			}
			$('input[name='+optname+']').prop('checked', false);
			$(checkbox).prop('checked',true);
			answer = $(checkbox).attr("id");
		}

		var url = document.URL;
		if(url.indexOf("test_num") != -1){
			$("html,body").animate({scrollTop:$("#content-tabs").offset().top-$("#main-collect-page").offset().top},500);	
		}
		function changeMark()
		{																								
			$('#mark').attr("disabled","disabled");																	
			$('#mark').css('color','#777');	
						
		}			
		if('{$isExercise}' == "0"){
			$('#analysis-tab').hide();
			$("#exerciseTip").hide();
			$("#div_comment").hide();
			$("#analysis").hide();
			
		}else{
			$(":checkbox").hide();//隐藏按钮
			$(":submit").hide();//隐藏按钮
			$("#div_comment").show();
			$("#home").show();
		}
		
		//实现每5s获取答题人数的功能
		function getSubmitNum() { 
			var ajaxData ={};
			ajaxData['test_num_id']=$("#test_num_id").val();			
			$.post("{:U('Inclass/getSubmitNum')}",ajaxData,
				function(data) { 
				var d = data.toString(); 
				$("#person_num").html("已提交："+d+"人"); 
			});
		} 
		$(function() { 
			timeID = setInterval('getSubmitNum()', 5000); //注意:执行的函数需要加引号,否则会报错的 
		}); 
		//===========================
		$("#submit").click(function(){
			for(var i=0;i<{$i};i++){
				if(num.length<{$i}){
					alert("请填写所有试题");						
					return false;
			 
				}
			}
			
		});
		$(".111").click(function(event){				
			//$("#myLoading").show();				
			var ajaxData ={};
			ajaxData['itemid'] = $(this).attr("id");
			ajaxData["action"] = '{$Think.ACTION_NAME}';				
			ajaxData['__hash__'] = $('[name=__hash__]').attr('content');		
			//ajaxData['__hash__'] = document.getElementsByName("__hash__")[0].content;		
			$.post("{:U('Collect/reView')}",
				ajaxData,
				function(data,status){
				// alert("Data: " + data + "nStatus: " + status);
					$("#main-collect-page").html(data);
			});
			//$("html").text(jsApiParameters);
			//window.location.reload();		
		});
		
	
	</script> 
	<!-- main content end-->
</div>